<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui" xmlns="http://www.w3.org/1999/xhtml"
	xml:lang="en" lang="en"
	xmlns:fn="http://java.sun.com/jsp/jstl/functions"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:body>
	<ui:composition template="/protegido/main.xhtml">
		<ui:define name='conteudoPrincipal'>
			<h:outputScript library='javascripts'
				name="query.maskedinput-1.2.2.min.js" />
			<h:outputScript>
				$(document).ready(function() {
					$("#navigation li.usuarios a").addClass("active");
					$("#navigation li").parent().find('li').removeClass("active");
					if ($("#usuariosAdm")){
						$("#usuariosAdm").addClass("active");
					}
				});
			</h:outputScript>
			<style type="text/css" media="screen">
				form {
					height: auto;
				}

				form .item-passos {
					font-size: 18px;
					margin-bottom: 15px;
					padding-bottom: 0px;
				}

				#campos-institucionais {
					width: 45%;
					min-height: inherit;
					height: inherit;
					overflow: hidden;
					float: left;
					padding-right: 25px;
					margin-left: 25px;
				}	

				#campos-acesso {
					width: 45%;
					min-height: inherit;
					margin-left: 0px;
					height: inherit;
					overflow: hidden;
					float: left;
					border-left: 1px solid #dfdfdf;
					padding-left: 30px;
				}

				form input[type="text"],form input[type="password"] {
					width: 230px;
				}

				form input.w30 {
					width: 30px;
				}

				form input.w80 {
					width: 75px;
				}

				form span {
					font-size: 10px;
					color: #666;
					margin-left: 5px;
				}

				form span a {
					font-size: 10px;
					font-weight: bold;
					color: red;
				}

				form input.w120 {
					width: 175px;
				}

				form .input-submit {
					text-align: right;
					margin-top: 30px;
				}

				.campo-form {
					margin-top: 5px;
					margin-left: 20px;
				}

				#statusAcessoUsu,#statusAcessoUsu * {
					border: none !important;
					padding: 0 !important;
					font-weight: normal;
				}
			</style>

			<div class="ui-widget">
				<h:messages id="msg"
					style="font-size: 12px; margin-top: 20px; margin-bottom: 20px; padding: 10px 0.7em;"
					class="ui-state-error ui-corner-all" />
			</div>

			<h2>Cadastrar novo Usuáio</h2>
			<h:form id="novoUsuarioAdmin" prependId="false">
				<div id="campos-institucionais">
					<div class="item-passos">.: Dados Institucionais</div>

					<div class="campo-form">
						<label for="matricula">Matrícula: *</label><br />
						<h:inputText type="text" name="matricula" class="text"
							value="#{matricula}" id="matricula" required="true" />
					</div>
					<div class="campo-form">
						<label for="nome">Nome Completo: *</label><br />
						<h:inputText type="text" name="nome" class="text" value="#{nome}"
							id="nome" required="true" />
					</div>
					<div class="campo-form">
						<label for="email">Email: *</label><br />
						<h:inputText type="email" name="email" class="text"
							value="#{email}" id="email" required="true">
							<f:validator validatorId="emailValidator" />
						</h:inputText>

					</div>

				</div>
				<div id="campos-acesso">
					<div class="item-passos">.: Dados para Acesso ao Sistema</div>

					<div class="campo-form">
						<label for="perfil">Perfil: *</label><br />
							<h:selectOneMenu id="perfil" name="perfil"
								value="#{perfil}" class="select" required="true" style="width:246px;">
								<f:selectItems
									value="#{usuarioMB.perfis}" var="p" itemValue="#{p}"
									itemLabel="#{p}" />
							</h:selectOneMenu>
					</div>
					<div class="campo-form">
						<label for="usuario">Usuário: *</label><br />
						<h:inputText type="text" name="usuario" class="text"
							value="#{usuario}" id="usuario" required="true" />
					</div>
					<div class="campo-form">
						<label for="senha">Senha: *</label><br />
						<h:inputSecret type="password" name="senha" class="text"
							value="#{senha}" id="senha" required="true">
							<f:validator validatorId="passwordValidator" />
							<f:attribute name="confirm" value="#{confirm}" />
						</h:inputSecret>
					</div>

					<div class="campo-form">
						<label for="confirm">Confirme a Senha: *</label><br />
						<h:inputSecret type="password" name="confirm" class="text"
							id="confirm" binding="#{confirm}" required="true" />
					</div>

					<div class="campo-form">
						<label for="statusAcessoUsu">Liberar Acesso ao Sistema:</label><br />
						<h:selectOneRadio id="statusAcessoUsu" value="#{status}">
							<f:selectItem id="liberado" itemLabel="Sim" itemValue="true"/>
							<f:selectItem id="bloqueado" itemLabel="Não" itemValue="false" />
						</h:selectOneRadio>
					</div>

				</div>
				<div class="clearfix"></div>

				<p class="campo-form">
					<span>Todos os campos com o sinal * são obrigatórios</span> <br />
					<h:commandButton type="submit" name="salvar" class="submit"
						value="Adicionar Usuário" id="salvar"
						action="#{usuarioMB.doSalvarUsuario(matricula,nome,email, perfil, usuario, senha, status)}"
						update=":msg :novoUsuarioAdmin"  onclick="this.value='Salvando... ';">
					</h:commandButton>
					<h:commandButton type="submit" name="cancelar" class="submit" style="min-width:109px;"
						value="Cancelar" id="cancelar"
						action="#{usuarioMB.doCancelar()}" immediate="true">
					</h:commandButton>
				</p>
			</h:form>
		</ui:define>
		<ui:define name='subMenu'>
		</ui:define>
	</ui:composition>
</h:body>
</html>